import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:lx_widgets_library/lx_widgets_library.dart';

// 仪表盘表单
class SpeedometerForm extends StatefulWidget {
  // 当前速度
  final RxDouble currentSpeed;

  // 当前速度单位
  final RxString currentSpeedUnit;

  // 仪表盘最大速度
  final RxDouble? maxSpeed;

  // 顶部间距
  final double topSpace;

  // 仪表盘高度
  final double speedometerHeight;

  // 圆角
  final double borderRadius;

  // 背景色
  final Color backgroundColor;

  // 仪表盘高度
  const SpeedometerForm(
    this.currentSpeed,
    this.currentSpeedUnit,
    this.topSpace,
    this.speedometerHeight,
    this.borderRadius,
    this.backgroundColor, {
    super.key,
    this.maxSpeed,
  });

  @override
  State<SpeedometerForm> createState() => _SpeedometerFormState();
}

class _SpeedometerFormState extends State<SpeedometerForm> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SizedBox(
        width: context.width,
        height: widget.speedometerHeight,
        child: Stack(children: [
          ClipRRect(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(widget.borderRadius),
              topRight: Radius.circular(widget.borderRadius),
            ),
            child: Container(
              padding: EdgeInsets.only(
                top: widget.topSpace,
                left: CONTENT_MARGIN,
                right: CONTENT_MARGIN,
              ),
              color: widget.backgroundColor,
              child: Center(
                child: // 仪表盘
                    SpeedometerView(
                  size: widget.speedometerHeight,
                  speed: widget.currentSpeed,
                  maxSpeed: widget.maxSpeed ?? 150.0.obs,
                  unit: widget.currentSpeedUnit,
                  borderColor: LxWidgetsLibraryService.to.colorType.color4
                      .withOpacity(0.4),
                  backgroundColor: Colors.transparent,
                  foregroundColor: LxCol.theme,
                  pointerColor: RedColor.red4,
                  divisionsColor: Colors.red.withOpacity(0.1),
                  divisionsTextColor: Colors.transparent,
                  textColor: Colors.white.withOpacity(0.8),
                  divisions: 20,
                ),
              ),
            ),
          )
        ]),
      ),
    );
  }
}
